{% load static %}
<!DOCTYPE html>
<html>
<head>
    <link rel="icon" href="{% static 'img/cape.png' %}">
    <link href="{% static 'css/guac-main.css' %}" rel="stylesheet" type="text/css"/>
    <script src="{% static 'js/crypto-js.min.js' %}"></script>
    <script src="{% static 'js/guac-main.js' %}"></script>
    <script src="{% static 'js/guacamole-1.4.0-all.min.js' %}"></script>
    <script src="{% static 'js/jquery.js' %}"></script>
    <script src="{% static 'js/jquery-ui.min.js' %}"></script>
    <meta charset="utf-8"/>
    <title>Guacamole Console</title>
</head>
<body>
    <div class="guaconsole">
        <div>
            <button id="stopTask">End Session</button>
        </div>
        <div id="container">
            <div id="terminal"></div>
        </div>
        <div class="dialog" id="launch_error">
            <div class="inner">
                <p class="message"></p>
                <p class="error_msg"></p>
                <button type="button" id="taskStatus">View Task</button>
            </div>
        </div>
        <script>
            document.getElementById("stopTask").addEventListener("click", function () {
                stopTask("{{task_id}}");
            });
            var task_url = location.origin + '/submit/status/{{task_id}}'
            document.getElementById("taskStatus").addEventListener("click", function() {
                location.replace(task_url);
            }, false);
	        GuacMe("html", "{{guest_ip}}","{{vncport}}", "{{session_id}}", "{{recording_name}}");
        </script>
    </div>
</body>
</html>
